<template>
	<view>
		<view class="cu-card dynamic" v-for="(work,index) in works" :key="index">
			<view class="cu-item shadow">
				<!--标题,内容图-->
				<view class="bg-img">
					<image mode="widthFix" :src="work.image"></image>
					<view class="cu-bar bg-shadeBottom"> <text class="text-cut" style="margin-left: 10upx;">{{work.content}}</text></view>
				</view>
				<!--标题,内容图-->
				<!--分享,点赞,评论-->
				<view class="text-gray text-sm text-right padding align-center">
					<!--点赞-->
					<button class="cu-btn cuIcon" :class="work.like===0?'':'bg-blue'" @tap="clickAppreciate(index)" >
						<text :class="work.isLike===0?'cuIcon-appreciatefill ':'cuIcon-appreciate'"
						class=" margin-lr-xs" style="font-size: 30upx;" ></text>
					</button>
					<text style="margin-left: 10upx;margin-right: 10upx;">{{work.appreciacte}}</text>
					<!--消息-->
					<button class="cu-btn cuIcon">
						<text :class="work.message===0?'cuIcon-messagefill':'cuIcon-message'"
						class=" margin-lr-xs" style="font-size: 30upx;" ></text>
					</button>
					<text style="margin-left: 10upx;margin-right: 10upx;">{{work.message}}</text>
					<!--分享-->
					<button class="cu-btn cuIcon" :class="work.share===0?'':'bg-green'" @tap="clickShare(index)" >
						<text class="cuIcon-share margin-lr-xs" style="font-size: 30upx;" ></text>
					</button>
		
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				works:[{
					image:"../../../static/logo.png",
					date:"2020年4月20日",
					content:"ruaruaruaruarua",
					appreciacte:14,
					message:10,
					like:0,
					share:0,
				},
				{
					image:"../../../static/logo.png",
					date:"2020年4月19日",
					content:"冲了,奥里给",
					appreciacte:12,
					message:10,
					like:0,
					share:0,
				},
				{
					image:"../../../static/logo.png",
					date:"2020年4月18日",
					content:"不想写了,吐了",
					appreciacte:10,
					message:10,
					like:0,
					share:0,
				},
				]
			}
		},
		methods: {
			clickAppreciate(index){
				if (this.works[index].like === 0) 
				{
					this.works[index].like = 1;
					this.works[index].appreciacte+=1;
							
				} else {
					this.works[index].like =  0;
				    this.works[index].appreciacte-=1;
				}
			},
			clickShare(e){
				var index = e;
				this.works[index].share = 1;
			}
		}
	}
</script>

<style>

</style>
